<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <!-- 引入vue2.0版本 -->
    <script src="../js/vue.js"></script>
    <title>模板语法</title>
  </head>
  <!-- 
    MVVM模型
            1.M：模型model————>Vue中的data
            2.V：视图View————>Vue模板
            3.VM：视图模型ViewModel————>Vue实例对象

            可以将ViewMode看作是Model和View的连接桥，View可以通过事件绑定Model，Model可以通过数据绑定View，通过ViewMode可以实现数据和视图的完全分离。
            官方文档里也解释道为什么vue创建的对象用VM接收，因为Vue实例就相当于ViewModel
 -->

  <body>
    <div id="root"></div>
    <script type="text/javascript">
      Vue.config.productionTip = false //以阻止vue在启动时生成生产提示
      const x = new Vue({
        el: '#root',
        data: {
          name: '张名师',
        },
      })
    </script>
  </body>
</html>
